<template>
    <div class="box_cont">
        <div class="test_cont flex_center_center" v-loading="loading">
            <p class="title">词汇量测试</p>
            <p class="text">花几分钟测试一下，测试你的词汇量水平</p>
            <img src="@/assets/img/test.png" alt="" srcset="">
            <el-button
            style="width: 228px; margin-top: 50px"
            type="primary"
            @click="startFun"
            >开始测试</el-button
            >
        </div>
    </div>
</template>

<script>
import { startExam } from '@/api/vocabulary.js'
import bear_content from '@/views/components/bear_content.vue'

export default {
    components:{
        bear_content
    },
    data() {
        return {
            loading: false,
            userId: 0,
            learnId: 0,
            flag: null // 1: 从课程类型进入
        }
    },
    mounted(){
        this.userId = this.$route.query.userId
        this.learnId = this.$route.query.learnId
        this.flag = this.$route.query.flag
    },
    methods:{
        startFun(){
            this.loading = true
            let param = {}
            if (this.userId) {
                param.userId = this.userId
            }
            startExam(param).then(res=>{
                this.loading = false
                if(res.error == 0){
                    let id = res.data.id
                    this.$store.commit('user/setFull',true)
                    if (this.learnId) {
                        this.$router.push({path:'/vocabulary/exam/info', query:{id: id, learnId: this.learnId, userId: this.userId, flag: this.flag}})
                        return
                    }
                    this.$router.push({path:'/vocabulary/exam/info', query:{id: id, flag: this.flag}})
                }
            })
        }
    }
}
</script>

<style lang="scss" scoped>
.test_cont{
    width: 100%;
    height: 100%;
    .title{
        // font-size: 36px;
        font-size: 3.6rem;
        font-weight: bold;
        color: #3A3F5E;
    }
    .text{
        font-size: 2rem;
        color: #626780;
        margin-top: 2.4rem;
    }
    img{
        width: 56.7rem;
        height: 24.9rem;
        margin-top: 5rem;
    }
    
}
</style>